<template>
	<view class="padding-30">
		<choose-tabs IsFontView :list="tabsList" :checkIndex="tabIndex" @checkView="handleTabs"></choose-tabs>
		<template v-if="tabIndex == 0">
			<view>
				<view class="choose-tabs-view">
					<choose-tabs width="400rpx" :list="tabsList2" :checkIndex="tabIndex2"
						@checkView="handleTabs1"></choose-tabs>
				</view>
				<template v-if="tabIndex2 == 0">
					<block v-for="(item,index) in Orderlist" :key="index">
						<order-message isMessageImage :orderInfo="item"></order-message>
					</block>
				</template>
				<template v-else>
					<block v-for="(item,index) in Orderlist" :key="index">
						<order-message isMessageImage :orderInfo="item"></order-message>
					</block>
				</template>
			</view>
		</template>
		<template v-else-if="tabIndex == 1">
			<view class="margin-top50">
				<block v-for="(item,index) in Orderlist" :key="index">
					<order-message isCoin :orderInfo="item"></order-message>
				</block>
			</view>
		</template>
		<template v-else>
			<view class="margin-top50">
				<block v-for="(item,index) in Orderlist" :key="index">
					<order-message :orderInfo="item"></order-message>
				</block>
			</view>
		</template>
		<view v-if="Orderlist&&Orderlist.length<1" style="margin-top: 200rpx;">
			<u-empty color="#ffffff" icon-color="#ffffff" text="暂无购买记录" mode="list"></u-empty>
		</view>
	</view>
</template>

<script>
	import chooseTabs from "@/components/tabs/chooseTabs.vue"
	import orderMessage from "@/components/order/order-message.vue"
	export default {
		components: {
			chooseTabs,
			orderMessage
		},
		data() {
			return {
				tabIndex: 0,
				tabsList: [{
						name: '梦创礼品'
					},
					{
						name: '纪念币'
					},
					{
						name: '原始股'
					},
				],
				tabIndex2: 0,
				tabsList2: [{
						name: '抽奖'
					},
					{
						name: '兑换'
					},
				],
				Orderlist:[],
				form:{
					type:3,
					order_type:7
				}
			}
		},
		onShow() {
			this.getOrderlist()
		},
		methods: {
			getOrderlist() {
				this.$http.post(this.$api.getOrderlist,this.form, {
					token: true
				}).then(res => {
					if(res.code == 1){
						this.Orderlist = res.data
					}
				})
			},
			handleTabs(index) {
				this.Orderlist = []
				this.tabIndex = index
				if(this.tabIndex == 0){
					this.form.type = 3
				}else if(this.tabIndex == 1){
					this.form.type = 1
					this.form.order_type = ''
				}else{
					this.form.type = 2
					this.form.order_type = ''
				}
				this.getOrderlist()
			},
			handleTabs1(index) {
				this.tabIndex2 = index
				if(this.tabIndex2 == 0){
					this.form.order_type = 7
				}else{
					this.form.order_type = 5
				}
				this.getOrderlist()
			}
		}
	}
</script>

<style lang="scss">
	.choose-tabs-view {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 50rpx 0;
	}
</style>